<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" >
		<title>医院护工-预约</title>
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/sytle.css">
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-2.1.4.min.js"></script>
	</head>
	<body style="background: #f1f1f1;">
		<div class="page">
			<header>
			    <div class="navbar">
			        <ul>
				        <li class="l-back">
				        <a href="javascript:history.go(-1)" >
				        <img src="${pageContext.request.contextPath}/images/left.png" alt="返回"/>
				        </a>
				        </li>
				        <li class="n-word">医院护工</li>
				        <li class="n-intro"><a href="${pageContext.request.contextPath}/goods/hospital.html">服务内容</a></li>
			        </ul>
			    </div>
		   	</header>
		   	<form action="${pageContext.request.contextPath}/need/create.html" method="post" id="myform">
		   	<div class="appointment_main">
			   	<div class="fwnr">
			   		<p class="question">请选择服务开始时间？</p>
			   		<p class="fwnr_date">请输入时间：<input type="date" value="${time}" id="wdate"></p>
			   	</div>
			   	<div class="fwnr">
			   		<p class="question">请选择服务时段？</p>
			   		<ul class="service-time clearfix">
			   			<li class="be-selected" onclick="getFee(80)">
			   				<p>白天</p>
			   				<p>￥80/12小时</p>
			   				<p>08:00-20:00</p>
			   			</li>
			   			<li onclick="getFee(80)">
			   				<p>夜晚</p>
			   				<p>￥80/12小时</p>
			   				<p>20:00-08:00</p>
			   			</li>
			   			<li onclick="getFee(150)">
			   				<p>全天</p>
			   				<p>￥150/24小时</p>
			   				<p>00:00-24:00</p>
			   			</li>
			   		</ul>
			   	</div>
			   	<div class="fwnr">
			   		<p class="question">请选择医院大致方位？</p>
			   		<select id="di" onchange="address()">
						<option value="渝中区">渝中区</option>
						<option value="江北区">江北区</option>
						<option value="渝北区">渝北区</option>
						<option value="南岸区">南岸区</option>
						<option value="沙坪坝区">沙坪坝区</option>
						<option value="九龙坡区">九龙坡区</option>
						<option value="大渡口区">大渡口区</option>
						<option value="巴南区">巴南区</option>
						<option value="北碚区">北碚区</option>
					</select>
					<input type="text" placeholder="请输入医院名称（选填）" class="hospital_txt" id="waddre" name="wHospitalAddre">
			   	</div>
			   	<div class="special_needs">
			   		<img src="${pageContext.request.contextPath}/images/message-select.png">
			   		<input type="text" placeholder="如果您有特殊需求，请留言" name="wDesc">
			   	</div>
			</div>
			<input type="hidden" name="wTitle"  value="医院护工"/>
			<input type="hidden" name="wNeedType" id="wNeedType" value="7"/>
			<input type="hidden" name="wFeeType" id="feev" value="80"/>
			</form>
			<button class="footer_fix" id="btn_sub">立即预约</button>
		</div>


<!---提示弹窗(未输入手机号码的弹出框，注册点击后弹出，2秒后自动消失)--->
      <div class="login-layer" style=" display:none;" id="tip"> <span id="tipMsg"></span> </div>


<script type="text/javascript">

	$(".service-time li").click(function(){
		$(".service-time li").removeClass("be-selected");
		$(this).addClass("be-selected").siblings().removeClass("be-selected");
	});
	
	Date.prototype.Format = function (fmt) { //author: meizz 
	    var o = {
	        "M+": this.getMonth() + 1, //月份 
	        "d+": this.getDate(), //日 
	        "h+": this.getHours(), //小时 
	        "m+": this.getMinutes(), //分 
	        "s+": this.getSeconds(), //秒 
	        "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
	        "S": this.getMilliseconds() //毫秒 
	    };
	    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
	    for (var k in o)
	    if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
	    return fmt;
	}

	$("#btn_sub").click(function(){
		
		var wdate=$("#wdate").val();
		
    	var isShow = true;
    	if(wdate==null || wdate==""){
    		$("#tip").show();
 	   		$("#tipMsg").text("请选择服务预定时间！");
 	   		isShow = false; 
 		  	close();
 		  	return;
    	}
    	
    	var date1=new Date(wdate); 
    	var date2 =new Date(new Date().Format("yyyy-MM-dd"));
    	var num=24*60*60*1000 ;  	//一天的毫秒数
    	var cha=date2.getTime()-date1.getTime(); //两个时间的毫秒差
    	if(cha>0){
    		$("#tip").show();
 	   		$("#tipMsg").text("请选择今天及之后的服务预定时间！");
 	   		isShow = false; 
 		  	close();
 		  	return;
    	}
    	
    	
    	if(isShow){
    		$('#myform').submit();
    	}
	});
        	
        function address() {
        	var di = $('#di').val();
        	var addre = $('#waddre').val();
        	$('#waddre').val(di + addre);
        }
        
        function close() {
    	 	setTimeout(function() {
    	 		$("#tip").hide();
    	 	}, 2000);
     	}
        
        function getFee(fee) {
        	$('#feev').val(fee);
        }
</script>

</body>
</html>

